<template>
<div>
 <el-button type="primary" @click="add(props)">添加</el-button>
  <el-table :data="indexData.slice((currentPage - 1) * pagesize, currentPage * pagesize)" style="width: 100%">

    <el-table-column prop="userName" label="姓名" width="120" />
    <el-table-column prop="telephone" label="电话" width="120" />
    <el-table-column prop="password" label="密码" width="120" />
    <el-table-column prop="realName" label="真名" width="120" />
    <el-table-column prop="loginCount" label="多少行" width="120" />
    <el-table-column prop="lastLogin" label="最后修改" width="120" />
    <el-table-column prop="createTime" label="创建时间" width="120" />
    <el-table-column fixed="right" label="Operations" width="200">
      <template #default="row">
        <el-button type="success" @click="handleClick(row)"> 编辑 </el-button>
        <!-- 删除确认框 -->
         <el-popconfirm title="确认要重置密码吗?" @confirm="reset(row)">
                  <template #reference>
                    <el-button type="warning" size="small">重置密码</el-button>
                  </template>
                </el-popconfirm>
      </template>
    </el-table-column>
  </el-table>
   <el-dialog v-model="dialogVisible1" title="增加" width="30%">
    <el-form label-width="150px">
      <el-form-item label="用户姓名">
        <el-input v-model="info1.userName" />
      </el-form-item>
    </el-form>
    <el-form label-width="150px">
      <el-form-item label="电话">
        <el-input v-model="info1.telephone" />
      </el-form-item>
    </el-form>
    <el-form label-width="150px">
      <el-form-item label="密码">
        <el-input v-model="info1.password" />
      </el-form-item>
    </el-form>
    <el-form label-width="150px">
      <el-form-item label="真名">
        <el-input v-model="info1.realName" />
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogVisible1 = false">取消</el-button>
        <el-button type="primary" @click="insert()" v-model="dialogVisible1"
          >确认</el-button
        >
      </span>


    </template>
  </el-dialog>


  <el-dialog v-model="dialogVisible" title="编辑" width="30%">
    <el-form label-width="120px">
      <el-form-item label="用户姓名">
        <el-input v-model="info.userName" />
      </el-form-item>

      <el-form-item label="电话">
        <el-input v-model="info.telephone" />
      </el-form-item>

       <el-form-item label="真名">
        <el-input v-model="info.realName" />
      </el-form-item>

       <el-form-item label="密码">
        <el-input v-model="info.password" />
      </el-form-item>
      
    </el-form>
        <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button type="primary" @click="edit()" v-model="dialogVisible">确认</el-button>
      </span>
    </template>
  </el-dialog>
  <el-pagination
        layout="total,sizes,prev,pager,next,jumper"
        :total="indexData.length"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
      />
</div> 
</template>

<script>
import { get } from '@/utils/request'
import { ElMessage } from 'element-plus'
export default {
  data() {
    return {
      dialogVisible: false,//修改对话框是否可见
      dialogVisible1: false,//增加对话框是否可见
      info: {},//修改数据
      info1: {},//新增数据
      indexData:[],//空数组
      adg:[],
      currentPage: 1, //默认页码为1
      pagesize: 7, //默认一页显示8条
    }
  },
  //初始化工作
   mounted() {
    get('/getAllUsers').then((res) => {
      console.log(res);
      this.indexData = res.data
    })
  },
  methods: {
    handleClick(data) {
      this.info = data.row
      this.dialogVisible = !this.dialogVisible
    },
    del(data) {
        get('/deleteUser',{userId:data.row.userId}).then((res) => {
         ElMessage({
           message: '删除成功！',
           type: 'success'
        })
        window.location.reload()
     }
     )
    },
    edit() {
        this.dialogVisible = !this.dialogVisible
        var dt = new Date(this.info.createTime)
        let year = dt.getFullYear()
        let month = dt.getMonth() + 1
        let date = dt.getDate()
        this.info.createTime = year + '/' + month + '/' + date
        this.dialogVisible = !this.dialogVisible
        var dt = new Date(this.info.createTime)
        let year1 = dt.getFullYear()
        let month1 = dt.getMonth() + 1
        let date1 = dt.getDate()
        this.info.lastLogin = year1 + '/' + month1 + '/' + date1
        get('/updateUser',this.info).then((res) => {
        ElMessage({
           message: '修改成功！',
           type: 'success'
        })
        console.log(res)
        window.location.reload()
    }
    )
    },
    add() {
      this.dialogVisible1 = !this.dialogVisible1
    },
    insert() {
      this.dialogVisible1 = !this.dialogVisible1
      get('/addUser',this.info1).then((res) => {
        console.log(res);
        if(res.data==1)
        {
        ElMessage({
          message:"添加成功",
          type:"success"
        })
        window.location.reload()
        }
        else
        {
        ElMessage({
          message:"添加失败",
          type:"danger"  
        })
        }
    })
  },
 reset(row) {
      this.adg = row
     get('/updatPassword', this.info).then((res) => {
        ElMessage({
          message: '修改成功！',
          type: 'success'
        })
        window.location.reload()
      })
    },

    
       reset(row) {
        get('/updateUser', {userId: row.row.userId,
        password:'1234' }).then((res) => {
          console.log(this.res)
          ElMessage({
            message: '重置成功！',
             type: 'success'
             })
             window.location.reload()
              })
              },
   handleSizeChange(size) {
    console.log(size,'size');
    this.pagesize=size;
    console.log(this.pagesize)
      //一页显示多少条
     
    },
  handleCurrentChange (currentPage) {
    console.log(currentPage,'currentPage');
    this.currentPage = currentPage;
    console.log(this.currentPage); //点击第几页
},

  }
}
</script>
